import React,{useState,useEffect} from 'react'
import '../static/less/profile.less' 

export default function Profile() {
    let [account,setAccount] = useState("");
    let [pass,setPass] = useState("");
    let [phone,setPhone] = useState("");
    let [email,setEmail] = useState("");
    
    const fileFn = ()=>{
        let acc = localStorage.getItem("account");
        let pas = localStorage.getItem("pass");
        let pho = localStorage.getItem("phone");
        let ema = localStorage.getItem("email");
        setAccount(acc);
        setPass(pas);
        setPhone(pho);
        setEmail(ema);
    } 

    //初始化
    useEffect(() => {
        fileFn();
    }, [])

    return (
        <div className='profile'>
            <div className='top'>
                <div className='back' onClick={
                    () => {
                        window.history.back();
                    }
                }></div>
                <h2 className='top-title'>我的资料</h2>
            </div>
            <div className='bottom'>
                <div className='box'>
                    <div className='left'>头像</div>
                    <div className='img right'></div>
                </div>
                <div className='box'>
                    <div className='left'>账号</div>
                    <div className='right'>{account}</div>
                </div>
                <div className='box'>
                    <div className='left'>手机号</div>
                    <div className='right'>{phone}</div>
                </div>
                <div className='box'>
                    <div className='left'>邮箱</div>
                    <div className='right'>{email}</div>
                </div>
            </div>
        </div>
    )
}
